{include file=header.html}
<script>
var floor_array=new Array();
</script>
<div  id="main" class="w-full index">
    <div id="page-home" class="w-full">
        <div class="relative">
        <div class="col-0" area="col-0" data-position="0" widget_type="area">
            <!--{widgets page=index area=col-0}-->
        </div>
        <div class="col-1 w  mb10 clearfix">
            <div class="left" area="col-1-left" data-position="2" widget_type="area">
                <!--{widgets page=index area=col-1-left}-->
            </div>
            <div class="middle" area="col-1-middle" widget_type="area">
                <!--{widgets page=index area=col-1-middle}-->
            </div>
            <div class="right" area="col-1-right" data-position="3" widget_type="area">
                <!--{widgets page=index area=col-1-right}-->
            </div>
        </div>
        </div>
        <div class="col-2 w green" area="col-2" data-position="1" widget_type="area">
            <!--{widgets page=index area=col-2}-->
        </div>
        <div area="row-2" data-position="0" widget_type="area">
            <!--{widgets page=index area=row-2}-->
        </div>
        <div class="col-3 w" area="col-3" data-position="1" widget_type="area">
            <!--{widgets page=index area=col-3}-->
        </div>
        <div area="row-3" data-position="0" widget_type="area">
            <!--{widgets page=index area=row-3}-->
        </div>
        <div class="col-4 w" area="col-4" data-position="1" widget_type="area">
            <!--{widgets page=index area=col-4}-->
        </div>
        <div area="row-4" data-position="0" widget_type="area">
            <!--{widgets page=index area=row-4}-->
        </div>
        <div class="col-5 w" area="col-5" data-position="1" widget_type="area">
            <!--{widgets page=index area=col-5}-->
        </div>
        <div area="row-5" data-position="0" widget_type="area">
            <!--{widgets page=index area=row-5}-->
        </div>
        <div class="col-6 w" area="col-6" data-position="1" widget_type="area">
            <!--{widgets page=index area=col-6}-->
        </div>
    </div>
    <div class="w-full absolute" style="top:270px"><div class="w relative"><div class="floor_nav" style="z-index: 990"><div id="floor_nav"></div></div></div></div>
</div>
<style>
#floor_nav{position:absolute;z-index: 990;top:50px;left:100px;background-color:#fff;width:40px;height:0;overflow: hidden;}
.floor_n .down{display:none;background-color:rgb(3,3,3);color:#fff;text-align:center;width:40px;height:40px;line-height:40px;cursor:pointer}
</style>
<script src="{res file=js/posfixed.js}"></script>
<script>
$(function(){

var pos=new Array();
var pos_i=0;
	for(var key in floor_array){
	pos[pos_i]=new Array();
		pos[pos_i]['offset'] = $("#floor_"+key).offset().top-80;
		pos[pos_i]['model_id']=key;
		pos_i++;

	}
 for(var i=0;i<pos.length;i++){
  for(var j=0;j<pos.length-i-1;j++){
   if(pos[j]['offset']>pos[j+1]['offset']){
    var swap=pos[j];
    pos[j]=pos[j+1];
    pos[j+1]=swap;
   }
  }
 }

for(var i=0;i<pos.length;i++){

$("#floor_nav").append("<div class='floor_n' id='floor_nav_"+pos[i]['model_id']+"' onclick='$(\"html,body\").animate({ scrollTop: "+pos[i]['offset']+" }, 400);'><div class='down'>"+floor_array[pos[i]['model_id']]['title']+"</div><div class='up'><img src='"+floor_array[pos[i]['model_id']]['image']+"' width=40 height=40></div></div>");
}

$("#floor_nav").css("left",(-$("#floor_nav").width())+'px');

//导航那个悬浮
$(".floor_nav").posfixed({
    distance: 50,
    pos: "top",
    type: "while",
    hide: false
});

var navL = $("#floor_nav .floor_n").length;
var navTop = (navL)*40;
$(window).bind("scroll",function(){
    var sTop = $(window).scrollTop();
    var sTop = parseInt(sTop);
    if(sTop > 900){
          $("#floor_nav").stop(true,false).animate({"width":"40px","height":navTop,"opacity":"1"},200);
     }
     if(sTop < 600+navTop){

         if($("#floor_nav").attr("height") != 0){
            $("#floor_nav").stop(true,false).animate({"width":"0","height":"0","opacity":"0"},200);
         }
         }
         var max_pos='';
         var max_index;
         for(var key in pos){
             //$("body").prepend(pos[key]['offset']+'<'+sTop+'<br>');
             if(pos[key]['offset']<sTop+100){
                 max_pos=pos[key]['model_id'];

                 max_index=key;
             }
         }
         $(".floor_nav .down").hide();
         $("#floor_nav .up").show();
         if(max_pos){
             //$("body").prepend(pos[max_pos]['color']);
             $("#floor_nav_"+max_pos+" .down").show();
             $("#floor_nav_"+max_pos +" .up").hide();
         }
})
})

</script>
<script>
$(window).bind("scroll",function(){
    var sTop = $(window).scrollTop();
    if(sTop >= 600){
          $(".fix_search").addClass('active');
     }else{
         $(".fix_search").removeClass('active');
     }

})
</script>
{include file=footer.html}